{% load static %}
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="{% static 'css/start_views.css' %}"/>
		<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
		<title></title>
	</head>
	<body>
		<div class="navigation">
				<img src="{% static 'img/LOGOOOO.png' %}" class="Logo">
				<a href="{% url 'start_views' %}" class="before">寻物启事</a>
				<a href="{% url 'second_views/' %}" class="before">失物招领</a>
				<a href="{% url 'publish' %}" class="before">发布帖子</a>
				<a href="{% url 'about' %}" class="last">关于</a>
                {% if requests.session.is_login == True %}
                    <a href="{% url 'per_center' %}" class="last">个人中心</a>
                {% else %}
                    <a href="{% url 'login' %}" class="last">登录 . 注册</a>
                {% endif %}
			</div>
        <div class="search-box">
            <div class="shadow"></div>
            <input type="text"  placeholder="请输入遗失物品名称:水杯">
            <ion-icon name="search"></ion-icon>
        </div>		
		<script src="https://unpkg.com/ionicons@4.5.10-0/dist/ionicons.js"></script>
		<div class="picture">
			<div class="banner" >
			     <div class="img-wrap">
			         <ul>
			             <li class="item" style="display: block">
			                 <a href="#"><img src="{% static 'img/海报.jpg' %}" alt="" class="lunbo"></a>
			             </li>
			             <li class="item">
			                 <a href="#"><img src="{% static 'img/海报2.jpg' %}" alt="" class="lunbo"></a>
			             </li>
			             <li class="item">
			                 <a href="#"><img src="{% static 'img/HAIBAO1.jpg' %}" alt=""class="lunbo"></a>
			             </li>
			        </ul>
			    </div>
			    <div class="lr-tab">
		        <div class="left btn"></div>
		        <div class="right btn"></div>
			    </div>
			    <div class="tab-btn">
			    <ul>
			        <li class="btn"></li>
			        <li class="btn"></li>
			        <li class="btn"></li>
			    </ul>
			    </div>
			</div>					
		</div>
		<div class="navbar">
			<div>
				<ul>
                    <li><a href="#">物品分类</a>
						<ul>
							<li><a href="search_classification?classification=live">生活用品</a></li>
							<li><a href="search_classification?classification=study">学习用品</a></li>
							<li><a href="search_classification?classification=ele">电子设备</a></li>
							<li><a href="search_classification?classification=makeup">化妆用品</a></li>
							<li><a href="search_classification?classification=bag">包具</a></li>
							<li><a href="search_classification?classification=one_card">一卡通</a></li>
							<li><a href="search_classification?classification=card">证件</a></li>
							<li><a href="search_classification?classification=other">其它</a></li>
						</ul>
					</li>
                </ul>
			</div>
            <form action="/search_start_time/" method="post">
                {% csrf_token %}
			<div class="date">
				丢失时间
				<label>
				    <input type="date" name="before_time" class="时间1">
					<input type="date" name="late_time" class="时间2">
				</label>
			</div>
				<button class="button_c">提交</button>
                </form>
			<div>
                <form action="/search_keyword/" method="post">
                    {% csrf_token %}
				<label>
					<input type="text" class="key" name="key" placeholder="关键字搜索:红色"/>
				</label>
                </form>
			</div>
		</div>
		<div class="container">
            {% for information in informations %}
			<div onclick="window.open('start_views_details?id={{ information.id }}','_self')">
				<img src="/media/{{ information.o_picture }}" alt="img">
				<p>物品名称:{{ information.o_name }}</p>
				<p>丢失地点:{{ information.o_place }}</p>
				<p>物品详情:{{ information.o_detail }}</p>
				<span>{{ information.o_date }}</span>
			</div>
            {% endfor %}
		</div>
	</body>
	<script type="text/javascript" src="{% static 'js/start_view.js' %}"></script>
</html>
